import React from 'react';
import { Button, Form, Table, Modal, Message } from 'antd';
const FormItem = Form.Item;



let registHistoryModal = React.createClass({
     contextTypes: {
        router: React.PropTypes.object
    },

    getInitialState() {
        return {
            data: [],
            pagination: {
                current: 1,
                pageSize: 10
            }
        }
     },
     handleCancel() {
         this.props.hideModal();
         this.handleReset()
     },
     componentDidMount() {
         this.handleSearch();
     },

    handleSearch() {
        this.setState({
          pagination: {
            current: 1
          }
        })
        this.fetch();
    },
    handleReset() {
        this.props.form.resetFields();
    },
    fetch() {
        var selectedrecord = this.props.selectedrecord;
        var tenementId = selectedrecord.tenementId;
        var funderBillId = this.props.funderBillId;
        let page = this.state.pagination.current;
        let forms = this.props.form.getFieldsValue();
        let params = Object.assign({}, { pageSize: 10, currentPage: page ,tenementId:tenementId,funderBillId:funderBillId})
        let _me = this
        Utils.sendAjax({
            url: '/funder/bill/history',
            data: JSON.stringify(params),
            callback: function (result) {
                if (result.code == '200') {
                    _me.setState({
                        data: result.data,
                        pagination: result.page
                    })
                }
            }
        })
    },


    rowKey(data) {
        return data.id;
    },

    handleTableChange(pagination) {
        const pager = this.state.pagination;
        pager.current = pagination.current;
        this.setState({
            pagination: pager
        });
        this.fetch();
    },
  render() {

      const { getFieldProps } = this.props.form;
      const columns = [
          {
              title: '租客姓名',
              dataIndex: 'renterName',
          }, 
          {
              title: '收款日期',
              dataIndex: 'receiptDate',
          }, {
              title: '收款金额(元)',
              dataIndex: 'receiptAmount',
          }, {
              title: '备注',
              dataIndex: 'remark',
          }];
      var modalBtns = [
            <Button key="back" className="ant-btn" onClick={this.handleCancel}>关 闭</Button>
        ];
      return (
          <Modal title="登记历史" width={800} visible={this.props.visible} onCancel={this.handleCancel}  footer={modalBtns}>
              <Table columns={columns}  onChange={this.handleTableChange} rowKey={this.rowKey} pagination={this.state.pagination} dataSource={this.state.data}  />
          </Modal>
      );
  }
});

registHistoryModal = Form.create()(registHistoryModal);
export default registHistoryModal